<template>
  <div class="page-container">
    <van-cell-group>
      <van-field
        ref="scanDom"
        v-model="scan"
        label=""
        left-icon="scan"
        style="background-color:lightYellow"
        placeholder="扫描包装码"
        size="large"
        clearable
        border
        @keyup.enter.native="handleScanOver"
        @clear="handleScanClear"
        @click-left-icon="handleScanClear"
      />
    </van-cell-group>
    <div v-show="status!='empty'">
      <van-divider><span style="font-size:9px">加工源</span></van-divider>
      <process-item :value="sourceStock" />
    </div>
    <div v-show="status=='process'">
      <van-divider><span style="font-size:9px">操作</span></van-divider>
      <van-cell-group>
        <van-cell
          label-width="20"
          size="large"
          v-for="option in processOptions"
          :key="option.unit">
          <process-option-item @pack-click="handlePack" :value="option"/>
        </van-cell>
        <van-cell title="">
          <template>
            <van-button type="warning" @click="handleUnpack">拆包</van-button>
          </template>
        </van-cell>
      </van-cell-group>
    </div>

    <div v-show="status=='finish'" class="result-container">
      <van-divider><span style="font-size:9px">加工结果</span></van-divider>
      <process-item
        style="margin-top:5px;"
        v-for=" stock in processResult"
        :key="stock.id"
        :value="stock"
      />
    </div>
  </div>
</template>

<script>
import FlowButtons from '@/components/FlowButtons.vue'
import ProcessItem from './ProcessItem.vue'
import ProcessOptionItem from './ProcessOptionItem.vue'

export default {
  data() {
    return {
      scan: '',
      status: 'empty',
      sourceStock: {},
      processOptions: [],
      processResult: []
    }
  },
  props: {
    propFlowKey: String
  },
  mounted() {
    this.$refs.scanDom.focus()
  },
  computed: {
    cpButtonDisable() {
      return !this.stock.id
    }
  },
  methods: {
    handleScanClear(event) {
      this.scan = ''
    },
    handleScanOver() {
      if (window.isPDAScan()) this.scan = window.getPDAScan()
      if (!this.scan) return
      const params = {
        uc: this.scan,
        ucType: 'sn',
        warehouseId: this.$store.getters.currentWarehouse.id
      }
      this.utils.loadShow()
      this.$ajax.get('/wm/stock/getProcessInfoByUC', { params }).then(response => {
        this.utils.loadHide()
        if (response.success) {
          this.sourceStock = response.data.stock
          this.processOptions = this.genOptions(response.data.options)
          this.status = 'process'
        }
      }).catch(err => {
        this.utils.loadHide()
      })
    },
    async handlePack(option) {
      const result = await this.$dialog.confirm({
        title: '警告',
        message: `确定要将 ${this.sourceStock.packageUnit} 加工成 ${option.unit} ？`
      })
      if (!result) return
      const params = {
        stockId: this.sourceStock.id,
        toUnit: option.unit,
        qty: option.processQty,
        serialRule: 'wm_stock_process_sn'
      }
      this.utils.loadShow()
      this.$ajax.post('/wm/stock/mobilePack', params).then(response => {
        this.utils.loadHide()
        if (response.success) {
          this.processResult = response.data
          this.printSN(this.processResult)
          this.$notify.success('加工操作完成！')
          this.status = 'finish'
          this.scan = ''
          this.$refs.scanDom.focus()
        }
      }).catch(err => {
        this.utils.loadHide()
      })
    },
    printSN(data) {
      const params = {
        labelKey: 'sn',
        data
      }
      this.$ajax.post('/sys/printer/printLabel', params).then(res => {
        this.$notify.success('已推送打印标签')
      })
    },
    async handleUnpack() {
      const result = await this.$dialog.confirm({
        title: '警告',
        message: '确定要将此包装拆包吗？'
      })
      if (!result) return
      const params = { stockId: this.sourceStock.id }
      this.utils.loadShow()
      this.$ajax.get('/wm/stock/unpack', { params }).then(response => {
        this.utils.loadHide()
        if (response.code == 0) {
          this.$notify.success('拆包操作完成！')
          this.clearForm()
        }
      }).catch(err => {
        this.utils.loadHide()
      })
    },
    genOptions(options) {
      options.forEach(option => {
        option.processQty = Math.floor(this.sourceStock.skuQty / option.rate)
        option.maxQty = Math.floor(this.sourceStock.skuQty / option.rate)
      })
      return options
    },
    clearForm() {
      this.sourceStock = {}
      this.processOptions = []
      this.status = 'empty'
      this.scan = ''
      this.$refs.scanDom.focus()
    }
  },
  components: {
    ProcessItem, ProcessOptionItem
  }

}
</script>

<style lang="scss" scoped>

</style>
